<template>
    <div class="con">
        <img src="../assets/images/logo.png" alt="" class="logo" onclick="return false">
        <img src="../assets/images/pic_IncreaseSuccess.png" alt="" onclick="return false">
        <input type="text" class="points" readonly :value="$route.params.point">
        <input type="text" class="times" readonly :value="$route.params.time">
        <router-link to="/myPoints">
            <img src="../assets/images/btn_Enter.png" alt="" class="enter" >
        </router-link>
        
    </div>
</template>

<script>
export default {
    name: "addPoints",
    data() {
        return {
            msg: "Welcome to Your Vue.js App"
        };
    },
    methods:{
        


    },
    mounted: function () { }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.con {
  text-align: center;
  position: relative;
}
.con img {
  width: 100%;
}
.con .logo{
    width: 34%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,30%);

}

.con .enter {
  width: 50%;
}

.con .points {
  position: absolute;
  right: 16%;
  top: 44%;
  height: 6%;
  width: 45%;
}
.con .times {
  position: absolute;
  right: 16%;
  top: 57%;
  height: 6%;
  width: 45%;
}
</style>
